<template>
{{#if ctrl.psSysPFPlugin}}
    {{> @macro/plugins/widget/widget-use.hbs appPlugin=ctrl.psSysPFPlugin}}
{{else}}
    <AppForm v-bind="$attrs" ref="searchForm" :name="model.codeName" :class="classNames" :data="store.data" style="{{#if ctrl.width}}width: {{ctrl.width}}px;{{/if}}{{#if ctrl.height}}height: {{ctrl.height}}px;{{/if}}" v-if="isShow">
        <div class="control-content app-control-searchform__content">
            <a-row class="app-control-searchform__left">
{{#if ctrl.noTabHeader}}
    {{#each ctrl.psDEFormPages as | ctrlPage | }}
        {{#each ctrlPage.psDEFormDetails as | formDetail | }}
            {{> @macro/widgets/form-detail/include-form.hbs type=formDetail.detailType item=formDetail}}
        {{/each }}
    {{/each}}
    {{else}}
            <a-tabs class="app-control-form__page">
        {{#each ctrl.psDEFormPages as | ctrlPage | }}
                {{> @macro/widgets/form-detail/include-form.hbs type=ctrlPage.detailType item=ctrlPage}}
        {{/each}}
            </a-tabs>
{{/if}}
            </a-row>
{{#and (neq ctrl.formStyle 'SEARCHBAR') (neq ctrl.searchButtonStyle 'NONE')}}
            <div class="app-control-searchform__right">
    {{#eq ctrl.searchButtonStyle 'SEARCHONLY'}}
                <AppButton @click="handleSearch" type="primary">\{{$t('common.searchform.search')}}</AppButton>
    {{else}}
                <a-dropdown-button
                    :transfer="true"
                    :trigger="['click']"
                    placement="bottomRight"
                    type="primary"
                    @click="handleSearch"
                >
                    <span>\{{$t('common.searchform.search')}}</span>
                    <template #icon>
                        <down-outlined />
                    </template>
                    <template #overlay>
                        <a-menu @click="handleAdvSearch">
                            <a-menu-item key="reset">
                                <div class="app-control-searchform__dropdown__item">\{{$t('common.searchform.reset')}}</div>
                            </a-menu-item>
                            <a-menu-item key="save">
                            </a-menu-item>
                        </a-menu>
                    </template>
                </a-dropdown-button>
                <a-button
					class="app-control-searchform_shrink"
					v-if="store.hasShrinkButton"
					@click="handleShrinkButtonClick"
					>\{{ store.shrinkButtonStatus ? $t('common.searchform.shrink') : $t('common.searchform.more') }}
				</a-button>
    {{/eq}}
            </div>
{{/and}}
        </div>
    </AppForm>
{{/if}}
</template>
<script setup lang="ts">
// 基于template/src/widgets/\{{appEntities}}/\{{ctrls@SEARCHFORM}}-searchform/\{{spinalCase ctrl.codeName}}-searchform.vue.hbs生成
{{> @macro/plugins/widget/widget-import.hbs ctrl=ctrl}}
import { AppCol } from '@/components/common/col';
import { AppRow } from '@/components/common/row';
{{#and (neq ctrl.formStyle 'SEARCHBAR') (neq ctrl.searchButtonStyle 'NONE') (neq ctrl.searchButtonStyle 'SEARCHONLY')}}
import { DownOutlined } from '@ant-design/icons-vue';
{{/and}}
import { AppForm, AppFormPage, AppFormGroup, AppFormTabPage, AppFormItem, AppFormButton, AppFormDruipart, AppFormIframe, AppFormRaw } from '@components/widgets/form';
import { useNavParamsBind, useEventBind, getCtrlClassNames, handleComponentAction } from '@/hooks/use-ctrl';
import { IContext, IEvent, IParam, ICtrlDataAction, ISearchFormAbility, ISearchFormControllerParams, ISearchFormStore, SearchFormActionType, SearchFormController, ILoadingHelper, createUUID, IViewCtx } from '@/core';
import { {{pascalCase ctrl.name}}ControlVO } from './{{spinalCase ctrl.codeName}}-searchform-vo';
import { model } from './{{spinalCase ctrl.codeName}}-searchform-model';
import SearchFormService from "@/core/modules/ctrl-service/searchform-service";

{{> @macro/widgets/ctrl/ctrl-props.hbs
    props="openView?: Function;
    newView?: Function;
    actions: ICtrlDataAction;
    "
}}

{{> @macro/common/emit.hbs name="ctrl" actionType="SearchFormActionType" ability="ISearchFormAbility"}}

const { keyPSAppDEField, majorPSAppDEField } = model;

let searchForm = ref<any>(null);

const ctrlService = new SearchFormService<{{pascalCase ctrl.name}}ControlVO>({{pascalCase ctrl.name}}ControlVO, model.entityCodeName);

const controlID = 'id' + createUUID();

const params: ISearchFormControllerParams<SearchFormActionType, ISearchFormAbility> = {
    name: props.name,
    model,
    evt,
    controlID,
    actions: props.actions,
    openView: props.openView,
    newView: props.newView,
    closeView: props.closeView,    
    ctrlService: ctrlService,
    pViewCtx: props.pViewCtx,
    formValidate: async () => { return await searchForm.value.formValidate() },
	formValidateFields: async (name: string[]) => { return await searchForm.value.formValidateFields(name); },
    handler: (data: ISearchFormStore) => { return reactive(data); }
};
// 表单控制器
const controller = new SearchFormController(params);
useNavParamsBind(controller, props);

const store: ISearchFormStore = controller.getStore();

const classNames = computed(() => {
  const shrinkClass = {
    'app-control-searchform--shrink':!store.shrinkButtonStatus,
  }
  const defaultClass = getCtrlClassNames(model, props);
  return Object.assign(defaultClass, shrinkClass);
});

const isShow = computed(() =>{
    const formDetails = model.detailModel;
    if(formDetails && Object.values(formDetails).length >0){
        const result = Object.values(formDetails).find(((item:IParam) =>{
            return item.detailType === 'FORMITEM';
        }))
        return result ? true : false;
    }else{
        return false;
    }
})

const handleShrinkButtonClick = () => {
	controller.shrinkButtonClick();
};

{{#and (neq ctrl.formStyle 'SEARCHBAR') (neq ctrl.searchButtonStyle 'NONE')}}
const handleSearch = (event: MouseEvent) => {
    controller.search();
}
    {{#neq ctrl.searchButtonStyle 'SEARCHONLY'}}
const handleAdvSearch = (info: any) => {
    controller.reset();
}
    {{/neq}}
{{/and}}
onMounted(() => {
    controller.ctrlMounted();
});
onUnmounted(() => {
    controller.ctrlDestroy();
})
</script>